function HP() {
    let canvas = document.getElementById("_canvas");
    let ctx = canvas.getContext("2d");
    let engine = new Engine(ctx);
    let layer = new Layer(ctx); 
    
    let img_player;
    layer.preload = function (loader) {
        img_player = loader.loadImage('assets/shot/spr_player.png');
    }

    layer.create = function () {
        let axis = new CoordinateObject();
        layer.addObject(axis);

        let player = new SpriteObject();
        player.name = 'player';
        player.x = canvas.width / 2;
        player.y = canvas.height / 2;
        player.setImage(img_player);
        player.addComponent(new GameComponent.WSADMove(20));
        player.addComponent(new GameComponent.LookAtMouse());
        player.addComponent(new GameComponent.AxisDottedLine());

        let hp = new Health(5, 'green');
        player.update = function () {
            hp.x = this.x + this.width + 5;
            hp.y = this.y + 5;
            if (Input.mouse_up_check('left')) {
                hp.reduce();
            }
        }
        layer.addObject(player);
        layer.addObject(hp);
    }
    engine.addLayer(layer);
    engine.run();
    return engine;
}